import React, {FC, useCallback, useEffect, useMemo} from "react";
import {coreConnect} from "../utils/StoreUtil.tsx";
import {message} from "antd";

interface GlobalMsgProps {
    showMsg: any
}

const GlobalMsg: FC<GlobalMsgProps> = (props) => {
    const {showMsg} = props;
    const [messageApi, contextHolder] = message.useMessage();

    const showMsgApi = useCallback((msgInfo) => {
        const {
            type, msg, duration = 3, fn = () => {
            }
        } = msgInfo;
        switch (type) {
            case "success":
                messageApi.success(msg, duration, fn);
                break;
            case "error":
                messageApi.error(msg, duration, fn);
                break;
            case "info":
                messageApi.info(msg, duration, fn);
                break;
            case "warning":
                messageApi.warning(msg, duration, fn);
                break;
            case "loading":
                messageApi.loading(msg, duration, fn);
                break;
            default:
                break;
        }
    }, []);

    useEffect(() => {
        if (showMsg) {
            showMsgApi(showMsg)
        }
    }, [showMsg]);

    const renderGlobalMsg = useMemo(() => {
        return (
            <div>
                {contextHolder}
            </div>
        )
    }, []);

    return (renderGlobalMsg);
};

export default coreConnect("msgReducer")(GlobalMsg);
